<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
        <script>
        $(function(){
            $.ajaxSetup({
                type:"POST",
                url:"./abc.php",
                dataType:"json",
                success:comment_add
            });
            
            
            //为按钮添加单击事件
           $("#btn").click(comment_send); 
        });
        function comment_send(){
          var vname=$("#input_name").val();
          var vcomment=$("#input_comment").val();
         $.ajax({data:{name:vname,comment:vcomment}});
        }
        function comment_add(data)
        {
            //更新网页中的某个部分，为body元素增加一行
            html="<tr><td>"+data.name+"</td><td>"+data.comment+"</td></tr>";
           
            $("tbody").append(html);
        }
        </script>
    </head>
    <body>
        <div>Ajax无刷新发表评论</div>
        <ul>
            <li>姓名:<input type="text" id="input_name"/></li>
            <li>评论:<input type="text" id="input_comment"/></li>
        </ul>
        <input id="btn" type="button" value="发表言论">
        <table border="1">
            <thead>
            <th>评论者姓名</th>
            <th>评论内容</th>
        </thead>
        <tbody>
        
            
        </tbody>
        </table>
    </body>
</html>
